<template>
  <div>
    <div>
      <el-row class="bgc">
        <el-col :span="24"> 自然人担保人信息</el-col>
      </el-row>
      <div v-for="(item, index) in loanInfo" :key="index">
        <el-form :label-position="labelPosition" label-width="160px" :model="item" :inline="true">
          <el-form-item label="与申请企业关系">
            <el-input v-model="item.relation" disabled />
          </el-form-item>
          <el-form-item label="姓名">
            <el-input v-model="item.name" disabled />
          </el-form-item>
          <el-form-item label="身份证号码">
            <el-input v-model="item.idNo" disabled> </el-input>
          </el-form-item>
          <el-form-item label="性别">
            <el-input v-model="item.sex" disabled> </el-input>
          </el-form-item>
          <el-form-item label="婚姻状况">
            <el-input v-model="item.maritalStatus" disabled />
          </el-form-item>
          <el-form-item label="联系电话">
            <el-input v-model="item.phone" disabled />
          </el-form-item>
          <el-form-item label="住所(通讯地址)">
            <el-input v-model="item.home" disabled> </el-input>
          </el-form-item>
          <el-form-item label="详细地址">
            <el-input v-model="item.address" disabled> </el-input>
          </el-form-item>
          <el-form-item label="工作单位">
            <el-input v-model="item.workName" disabled> </el-input>
          </el-form-item>
          <el-form-item label="工作单位性质">
            <el-input v-model="item.workType" disabled> </el-input>
          </el-form-item>
          <el-form-item label="职务">
            <el-input v-model="item.workJob" disabled> </el-input>
          </el-form-item>
          <el-form-item label="工作单位地址">
            <el-input v-model="item.workAddress" disabled> </el-input>
          </el-form-item>
          <el-form-item label="学历">
            <el-input v-model="item.education" disabled> </el-input>
          </el-form-item>
          <el-form-item label="是否有本地房产">
            <el-switch v-model="item.house" class="mb-2" active-text="是" inactive-text="否" active-value="1" inactive-value="0" disabled />
          </el-form-item>
          <el-form-item label="是否本地户籍">
            <el-switch v-model="item.localDomicile" class="mb-2" active-text="是" inactive-text="否" active-value="1" inactive-value="0" disabled />
          </el-form-item>
          <el-form-item label="是否有子女">
            <el-switch v-model="item.children" class="mb-2" active-text="是" inactive-text="否" active-value="1" inactive-value="0" disabled />
          </el-form-item>
          <el-form-item label="年收入">
            <el-input v-model="item.yearly" disabled>
              <template #append>
                <span> 元</span>
              </template>
            </el-input>
          </el-form-item>
          <el-form-item label="资产金额">
            <el-input v-model="item.asset" disabled>
              <template #append>
                <span> 元</span>
              </template>
            </el-input>
          </el-form-item>
          <el-form-item label="负债金额">
            <el-input v-model="item.debt" disabled>
              <template #append>
                <span> 元</span>
              </template>
            </el-input>
          </el-form-item>
          <el-row class="bgc">
            <el-col :span="24"> 影像采集</el-col>
          </el-row>
          <el-image :src="`http://116.228.78.26:52800/nymanagerFile/${item.imgPath}`" lazy style="width: 200px; height: 200px" v-if="item.imgPath != '' && item.imgPath != null" />
          <div v-else class="img_box">暂无图片</div>
        </el-form>
      </div>
    </div>
    <div>
      <el-row class="bgc">
        <el-col :span="24"> 企业担保信息</el-col>
      </el-row>
      <div v-for="(item, index) in companyList" :key="index">
        <el-form :label-position="labelPosition" label-width="160px" :model="item" :inline="true">
          <el-form-item label="与申请企业关系">
            <el-input v-model="item.relation" disabled />
          </el-form-item>
          <el-form-item label="名称">
            <el-input v-model="item.name" disabled />
          </el-form-item>
          <el-form-item label="证件号码">
            <el-input v-model="item.idNo" disabled> </el-input>
          </el-form-item>
          <el-form-item label="法定代表人">
            <el-input v-model="item.deputy" disabled> </el-input>
          </el-form-item>
          <el-form-item label="法定代表人联系电话">
            <el-input v-model="item.deputyPhone" disabled />
          </el-form-item>
          <el-form-item label="实际控制人">
            <el-input v-model="item.controller" disabled />
          </el-form-item>
          <el-form-item label="实际控制人联系电话">
            <el-input v-model="item.controllerPhone" disabled />
          </el-form-item>
          <el-form-item label="详细地址">
            <el-input v-model="item.address" disabled />
          </el-form-item>
          <el-form-item label="所属行业">
            <el-input v-model="item.industry" disabled />
          </el-form-item>
          <el-form-item label="企业性质">
            <el-input v-model="item.type" disabled />
          </el-form-item>
          <el-form-item label="上一年资产总额">
            <el-input v-model="item.asset" disabled />
          </el-form-item>
          <el-form-item label="上一年营业收入">
            <el-input v-model="item.income" disabled />
          </el-form-item>
          <el-form-item label="上一年净资产">
            <el-input v-model="item.netAsset" disabled />
          </el-form-item>
          <el-form-item label="上一年净利润">
            <el-input v-model="item.netProfit" disabled />
          </el-form-item>
          <el-row class="bgc">
            <el-col :span="24"> 影像采集</el-col>
          </el-row>
          <el-image :src="`http://116.228.78.26:52800/nymanagerFile/${item.imgPath}`" lazy style="width: 200px; height: 200px" v-if="item.imgPath != '' && item.imgPath != null" />
          <div v-else class="img_box">暂无图片</div>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script setup name="Gen">
import { Search } from "@element-plus/icons-vue";
import { reactive, ref, nextTick } from "vue";
import { queryOrgTree } from "@/api/org";
import { onMounted } from "vue";
import { ElMessageBox, ElTree } from "element-plus";

const treeRef = ref();
const router = useRouter();
const route = useRoute();
const { proxy } = getCurrentInstance();
const tableList = ref([]);
const loading = ref(false);

const labelPosition = ref("right");
const state = reactive({
  loanInfo: {}, //担保信息
  companyList: {},
});
const { loanInfo, companyList } = toRefs(state);

const props = defineProps({
  dataFrom: {
    type: Object,
    required: true,
  },
});
onMounted(() => {
  setTimeout(() => {
    loanInfo.value = props.dataFrom.personalList;
    companyList.value = props.dataFrom.companyList;
  }, 400);
});

// 添加
function staffAdd() {}

//查询角色列表
function getList(val) {}

//查看
function handleEditTable(val) {
  if (val.type == "个人") {
    router.push({ path: "private" });
  } else {
    router.push({ path: "corporate" });
  }
}

// getList();
</script>
<style lang="scss" scoped>
.headline {
  background-color: #f3f3f3;
  text-align: left;
  span {
    display: block;
    padding-top: 5px;
    margin-left: 5px;
  }
}


.flexImg {
  width: 100%;
  padding-left: 20px;
  margin-bottom: 5px;
}
.box_flex {
  display: flex;
}
.box {
  margin-right: 20px;
}
.img_box {
  width: 200px;
  height: 200px;
  border: 1px solid #ccc;
  line-height: 200px;
  text-align: center;
}

.bgc {
  background: #f2f2f2;
  margin-bottom: 5px;
  height: 30px;
  line-height: 30px;
  font-size: 16px;
  padding-left: 20px;
}

:deep(.el-form-item--default) {
  margin-bottom: 5px;
  width: 40%;
}
:deep(.el-select) {
  width: 100%;
}
:deep(.el-form-item) {
  margin-right: 120px;
}

:deep(.el-overlay-dialog) {
  top: 500vh;
}
:deep(.el-aside) {
  margin: 0;
  padding: 0;
  border: 1px solid #dadbdc;
  background: #fff;
}

.title {
  height: 30px;
  line-height: 30px;
  background-color: #ebebeb;
  text-align: center;
}
.pd-5 {
  padding: 5px;
}
:deep(.el-affix) {
  width: 100% !important;
}
</style>
